<template>
	<!-- 发布文章 -->
	<view>
		<view class="article_top">
			<input v-model="newsform.title" type="text" maxlength="15" class="article_tltle" placeholder="添加主标题,最多20个字" />
		</view>
		<xiaEditor value="" placeholder="" @editorChange="getHtml"></xiaEditor>
		
		<view class="add_cover_view">
			<view class="thumbnail_view" v-if="newsform.image_url">
				<image class="imgthumb" :src="photo_cdn+newsform.image_url" mode=""></image>
			</view>
			<view v-else class="add_cover" @tap="uploadimg">
				<image class="cover_img" :src="photo_cdn + 'zpupload/static/img/camera.png'"></image>
				<view class="cover_title">添加封面</view>
			</view>
		</view>
		
		
		<view class="accordtag">
			<view class="radioview">
				<radio @tap="radioChange" :checked="isAgree" :color="$themecolor" />已阅读并同意
				<text @tap="totreaty" class="atag">《用户协议》</text>
				用户协议中关于发布族志的说明策略
			</view>
			
		</view>
		
		<view class="submit_send" @tap="submitfun">
			<view class="sendbtnss">发布</view>
		</view>
		
	</view>

</template>

<script>
	import xiaEditor from '@/components/xia-editor/xia-editor.vue'
	import {createArticle} from "@/utils/api/zuzhi.js";
	import config from "@/utils/config.js";
	let {uploadFile,photo_cdn} = config.baseUrl;
	export default {
		components: {
			xiaEditor
		},
		data() {
			return {
				isAgree:false,
				photo_cdn,
				newsform:{
					title:"",
					image_url:"",
					content:"",
				}
			}
		},
		methods: {
			//用户协议
			totreaty(){
				uni.navigateTo({
					url:"/pages/mine/agreement/agreementuser"
				})
			},
			//单选框
			radioChange(e){
				this.isAgree = !this.isAgree;
			},
			//得到的富文本 change
			getHtml(e){
				console.info(e);
				this.newsform.content = e;
			},
			//上传图片
			uploadimg(){
				
				uni.chooseImage({
					count:1,
					sourceType:['album','camera'],//album 从相册选图，camera 使用相机
					success: (e) => {
						uni.uploadFile({
						    url: uploadFile, 
						    filePath: e.tempFilePaths[0],
						    name: 'file',
							header:{
								'token':uni.getStorageSync("token"),
							},
						    formData: {
						       "Content-Type": "multipart/form-data",
						       water: 0
						    },
						    success: (res) => {
								let {data} = JSON.parse(res.data)
								console.log('多选',data);
								// data.url
								this.newsform.image_url = data.url;
								
						    },
							fail: (err) => {
								this.$api.msg("上传图片失败");
							}
						});
					}
				});
			},
			submitfun(){
				
				if(!this.isAgree){
					this.$api.msg("请阅读并同意用户协议!");
					return false;
				}
				
				let {newsform} = this;
				if(!newsform.title){
					this.$api.msg("请输入标题!");
					return false;
				}
				
				if(!newsform.content){
					this.$api.msg("请输入内容!");
					return false;
				}
				if(!newsform.image_url){
					this.$api.msg("请输入上传缩略图!");
					return false;
				}
				createArticle({
					...newsform,
				}).then((res)=>{
					console.info("res",res);
					if(res.code==1){
						this.$api.msg("提交成功!");
						setTimeout(()=>{
							uni.navigateBack();
						},1500)
					}else{
						this.$api.msg(res.msg);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "./push_article.scss"
</style>